<!DOCTYPE html>
<html>
{include file="public/header" /}
<body>

<div class="layui-fluid" id="app" style="margin-top: 0px">

    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">

            <div class="layui-card">

                <div class="layui-card-body">
                    <form class="layui-form" action="" lay-filter="component-form-group">

                        <div class="layui-card-body" style="padding: 15px;">

                            <input type="hidden" name="id" value="{$item.id}">
                            <div class="layui-form-item">
                                <label class="layui-form-label">店铺</label>
                                <div class="layui-inline">
                                    <div class="layui-input-inline" style="width: 100px;">
                                        <input type="text" class="layui-input" id="selected_dp" readonly="readonly"
                                               value="{$item.shangjia.shop_name}">
                                        <input type="hidden" name="shop_uid" value="{$item.shop_uid}" id="dp">
                                    </div>
                                    <div class="layui-input-inline">
                                        <button type="button" class="layui-btn " id="" style=""
                                                onclick="selectdp(this)">
                                            选择店铺
                                        </button>
                                        <!--<button type="button" class="layui-btn layui-btn-primary" id="pinpainew" onclick="addpinpai(this)">-->
                                        <!--新增品牌-->
                                        <!--</button>-->

                                    </div>
                                </div>

                            </div>
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">名称</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="name" value="{$item.name}" class="layui-input"
                                               lay-verify="required">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">分类</label>
                                    <div class="layui-input-inline">
                                        <select name="fenlei" id="fenlei">
                                            <option value=""></option>
                                            <option value="开关">开关</option>
                                            <option value="门">门</option>
                                            <option value="地板">地板</option>
                                            <option value="窗帘">窗帘</option>
                                            <option value="油漆">油漆</option>
                                            <option value="锁">锁</option>
                                            <option value="插座">插座</option>
                                        </select>
                                    </div>
                                </div>
                            </div>

                            <div class="layui-form-item">

                                <div class="layui-inline">
                                    <label class="layui-form-label">型号</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="xinghao" value="{$item.xinghao}" class="layui-input"
                                               lay-verify="required">
                                    </div>
                                </div>


                                <div class="layui-inline">
                                    <label class="layui-form-label">材质</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="caizhi" value="{$item.caizhi}" class="layui-input"
                                               lay-verify="required">
                                    </div>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">位置</label>
                                <div class="layui-input-block">
                                    <input type="checkbox" name="wz" title="客厅" lay-skin="primary" value="客厅">
                                    <input type="checkbox" name="wz" title="厨房" lay-skin="primary" value="厨房">
                                    <input type="checkbox" name="wz" title="卧室" lay-skin="primary" value="卧室">
                                    <input type="checkbox" name="wz" title="洗漱台" lay-skin="primary" value="洗漱台">
                                    <input type="checkbox" name="wz" title="阳台" lay-skin="primary" value="阳台">
                                    <input type="checkbox" name="wz" title="浴室" lay-skin="primary" value="浴室">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">品牌</label>
                                    <div class="layui-inline">
                                        <div class="layui-input-inline" style="width: 100px;">
                                            <input type="text" class="layui-input" id="selected" readonly="readonly"
                                                   value="{$item.pinpai.pinpai}">
                                            <input type="hidden" name="pinpai_id" value="{$item.pinpai_id}" id="pp">
                                        </div>
                                        <div class="layui-input-inline">
                                            <button type="button" class="layui-btn " id="pinpai" style=""
                                                    onclick="selectpinpai(this)">
                                                选择品牌
                                            </button>

                                        </div>
                                    </div>

                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">价格</label>
                                    <div class="layui-input-inline" >
                                        <input type="text" name="price" value="{$item.price}"  class="layui-input" lay-verify="required" >
                                    </div>
                                    <div class="layui-form-mid">元</div>

                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">优惠</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="discount" value="{$item.discount}" class="layui-input"
                                               lay-verify="required">
                                    </div>
                                    <div class="layui-form-mid">折</div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">图片</label>

                                <div class="layui-input-inline " style="width: auto;">

                                    <div class="layui-upload-drag" id="pic1" style="padding: 2px">
                                        <img v-if="tp=='null'" class="layui-upload-img"
                                             style="width: 120px;height: 120px; object-fit: cover;"
                                             src="/res/img/thumb.png">
                                        <img v-else class="layui-upload-img"
                                             style="width: 120px;height: 120px; object-fit: cover;"
                                             src="{$item.thumb2}">
                                        <input type="hidden" name="thumb" value="{$item.thumb}">
                                    </div>

                                </div>
                            </div>

                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">简介</label>
                                <div class="layui-input-block">
                                    <textarea name="remarks" placeholder="请输入内容"
                                              class="layui-textarea">{$item.remarks}</textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">状态</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="status" value="1" title="上架" {if
                                           condition="$item.status==1" } checked="" {/if}>
                                    <input type="radio" name="status" value="0" {if condition="$item.status==0" }
                                           checked="" {/if} title="下架">

                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn" type="button" lay-submit lay-filter="bianji">保存</button>
                                </div>
                            </div>

                        </div>

                    </form>
                </div>


            </div>
        </div>
    </div>


</div>
</body>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            tp: ""
        },

    });
    app.tp = "{$item.thumb2}";

    layui.use(['form', 'laydate', 'upload'], function () {
        var $ = layui.$
            , element = layui.element
            , layer = layui.layer
            , laydate = layui.laydate
            , form = layui.form;
        var upload = layui.upload;

        form.render(null, 'component-form-group');

        laydate.render({
            elem: '#LAY-component-form-group-date'
        });



        //拖拽上传
        upload.render({
            elem: '#pic1'
            , url: '/tool/qiniu/upload'
            , before: function () {
                layer.load(2);
            }
            , done: function (res) {
                layer.closeAll();
                console.log(res)
                $('#pic1 img').attr('src', res.data.url);
                $('#pic1 input').val(res.data.pic);
            }
        });


        /* 监听提交 */
        form.on('submit(bianji)', function (data) {
            //提交复选框选中的值
            var groupCheckbox=$("input[name='wz']");
           // console.log(groupCheckbox);
            var weizhi="";
            for(i=0;i<groupCheckbox.length;i++){
                if(groupCheckbox[i].checked){
                    var val =groupCheckbox[i].value;
                    if(weizhi.length>0){
                        weizhi+=","+val;
                    }else{
                        weizhi+=val;
                    }

                }
            }
            data.field['weizhi']=weizhi;
            $.post("{:url('edit')}", data.field, function (res) {
                if (res.code == 1) {

                    //将数据传入到父元素
//                        parent.app.items.push(data.field);
//                        $('.layui-form')[0].reset();
                    parent.init();
                    parent.layer.closeAll();
                    parent.layer.msg(res.msg, {icon: 1})
//                        $('#phone').val('');


                    return false;
                } else {
                    parent.layer.msg(res.msg, {icon: 2})
                    return false;
                }
            });


            return false;
        });
    });
    //选择店铺弹窗
    function selectdp(that) {

        var data_id = $(that).attr('data_id');
        layer.open({

            type: 2,
            title: '选择',
            shadeClose: true,
            shade: 0.01,
            area: ['80%', '80%'],
            content: "{:url('selectdp')}?id=" + data_id //iframe的url

        });

    }
    //选择店铺内容值获取
    function dianpu(uid, name) {
        // console.log(uid);
        // console.log(name);
        $('#selected_dp').val(name);
        $('#dp').val(uid);

    }
    //选择品牌弹窗
    function selectpinpai(that) {

        var data_id = $(that).attr('data_id');
        layer.open({

            type: 2,
            title: '选择',
            shadeClose: true,
            shade: 0.01,
            area: ['80%', '80%'],
            content: "{:url('selectpinpai')}?id=" + data_id //iframe的url

        });

    }
    //选择品牌内容值获取
    function selectpp(id, name) {
        // console.log(id);
        // console.log(name);
        $('#selected').val(name);
        $('#pp').val(id);

    }
    //设置选择分类状态
    function setSelect(ele, val) {

        $('#' + ele + ' option').each(function (index, ele) {
            var el = $(ele);
            if (el.attr('value') == val) {
                el.attr('selected', 'selected')
            } else {
                el.removeAttr('selected');
            }
        })

    }

    $(function () {
        setSelect('fenlei', "{$item.fenlei}")
    });
    //获取复选框选中的值
    var re = "{$item.weizhi}";
    var check = re.split(",");
    var groupCheckbox = $("input[name='wz']");
    $(function () {
        for (var i = 0; i < groupCheckbox.length; i++) {
            var val = groupCheckbox[i].value;
            if (check.indexOf(val) != -1) {
                groupCheckbox[i].checked = true;
            }
        }
    });
</script>
</html>










